<style scoped>
    .formBox{
        padding: 20px 0;
    }
</style>
<template>
    <div>
        <product-title></product-title>
        <div class="formBox">
            <Row>
                <i-col span="8" offset="1">
                    <Form :model="formItem" :label-width="120" ref="formItem">
                        <FormItem label="上级分类" >
                            <Select v-model="formItem.pid" :disabled="canchange" @on-change="">
                                <!--<Option v-for="item in option" :value="item.value" :key="item.value">{{ item.label }}</Option>-->
                                <Option value="0">根分类</Option>
                                <!--<Option value="分类二">分类二</Option>-->
                                <!--<Option value="分类二">分类三</Option>-->
                                <template v-for="(item,value) in formItem.fenlei1">
                                    <Option :value="item.id" :key="item.id">{{item.cate_name}}</Option>
                                </template>
                            </Select>
                        </FormItem>
                        <FormItem label="分类名称">
                            <Input v-model="formItem.cate_name"></Input>
                        </FormItem>
                        <FormItem>
                            <i-button type="primary" @click="handleSubmit('formItem')"> 提交 </i-button>
                        </FormItem>
                    </Form>
                </i-col>
            </Row>
        </div>
    </div>
</template>
<script>
    import productTitle from '../../components/productTitle.vue';
    import { getClassList  ,create_cate ,get_cate_first ,update_cate, getOne} from '../../api/parter';
    export default {
        created(){
        },
        activated(){
            this.formItem.cate_name='';
            this.formItem.pid='';
            new Promise((resolve,reject)=>{
                get_cate_first().then(res=>{
                    this.$refs["formItem"].resetFields();
//                       console.log(res.data);
                    this.formItem.fenlei1 = res.data.data?res.data.data:[];
                }).catch(error=>{
                    reject(error);
                });
            });
            this.getCont();
        },
        data() {
            return {
                formItem: {
                    cate_name: '',
                    pid:'',
                    fenlei1:[],
                    id:''
//                    firstClass:'',
//                    option:[1,2,3,6,5]
                },
                canchange: false,
                lat: {
                    type: 'Number'
                },
                lng: {
                    type: 'Number'
                },
            }
        },
        components: {
            productTitle
        },
        methods:{
            getCateFirst(){
                new Promise((resolve,reject)=>{
                    get_cate_first().then(res=>{
                        this.formItem.fenlei1 = res.data.data;
                    }).catch(error=>{
                        reject(error);
                    });
                });
            },
            getCont(){
                let id=this.$route.params.id;
                this.formItem.id = this.$route.params.id;
                if(id && id!=0){
                    this.canchange=true;
                    let params = {
                        id:id
                    }
                    this.getCateFirst();
                    new Promise((resolve,reject)=>{
                        getOne(params).then(res=>{
                            if(res.data.err == 0){
                                this.formItem.pid = res.data.data.pid;
                                this.formItem.cate_name = res.data.data.cate_name;
                            }else{
                                this.$Message.error(res.data.info);
                            }
                            resolve();
                        }).catch( error =>{
                            reject(error);
                        });
                    });
                }else if(this.$route.params.id==""){
                    this.canchange=false;
                }

            },
            handleSubmit(){
                if(this.$route.params.id && this.$route.params.id!=0){
                    new Promise((reslove,reject)=>{
                        update_cate(this.formItem).then(res=>{
                            if(res.data.err==0){
                                this.$router.push({name:'com_proClass'});
                            }else{
                                this.$Message.error(res.data.info);
                            }
                        }).catch(error=>{
                            reject(error);
                        });
                    });
                }else if(this.$route.params.id==""){
                    new Promise((resolve,reject)=>{
                        create_cate(this.formItem).then(res=>{
                            if(res.data.err==0){
                                this.$router.push({name:'com_proClass'});
                            }else{
                                this.$Message.error(res.data.info);
                            }
                            resolve();
                        }).catch(error=>{
                            reject(error);
                        });
                    });
                }
            }

        }
    }
</script>

